<!-- <template>
	<el-pagination
		background
		layout="total, sizes, prev, pager, next, jumper"
		:total="pageData.total"
		:page-size="pageData.pageSize"
		@current-change="pageChange"
		:page-sizes="[3, 5, 10, 30]"
		@size-change="sizeChange"
	/>
</template>

<script lang="ts" setup>
	import { onMounted, reactive } from 'vue';

	const props = defineProps({ modelValue: { type: Object, default: {} } });

	const emits = defineEmits(['onChange', 'update:modelValue']);

	let pageData = reactive<any>({
		total: 0,
		pageSize: 5,
		pageNum: 1,
	});

	onMounted(() => {
		emits('update:modelValue', pageData);
		pageData = props.modelValue;
	});

	const callApi = () => {
		emits('update:modelValue', pageData);
		emits('onChange');
	};

	const pageChange = (val: number) => {
		pageData.pageNum = val;
		callApi();
	};
	const sizeChange = (val: number) => {
		pageData.pageSize = val;
		callApi();
	};
</script> -->